<template>
	<el-container>
		<el-main class="nopadding">
			<sc-VxeTable
				ref="xGrid1"
				:gridEvts="gridEvents"
				:tablecode="'setting_role'"
				:url="$API.system.role.list"
			>
			</sc-VxeTable>
		</el-main>
	</el-container>

	<save-dialog
		v-if="dialog.save"
		ref="saveDialog"
		@closed="dialog.save = false"
	></save-dialog>

	<permission-dialog
		v-if="dialog.permission"
		ref="permissionDialog"
		@closed="dialog.permission = false"
	></permission-dialog>
</template>

<script>
import saveDialog from "./save";
import permissionDialog from "./permission";

export default {
	name: "role",
	components: {
		saveDialog,
		permissionDialog,
	},
	data() {
		return {
			dialog: {
				save: false,
				permission: false,
			},
			gridEvents: {
				add: () => {
					this.add();
				},
				edit: ({ button }) => {
					this.table_edit(button.selectRecords[0]);
				},
				permission: ({ button }) => {
					this.permission(button.selectRecords[0]);
				},
			},
		};
	},

	methods: {
		//添加
		add() {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open();
			});
		},
		//编辑
		table_edit(row) {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open("edit").setData(row);
			});
		},

		//权限设置
		permission(row) {
			this.dialog.permission = true;

			this.$nextTick(() => {
				this.$refs.permissionDialog.setData(row.id).open();
			});
		},
	},
};
</script>

<style></style>
